<template>
  <div>
    <Ueditor :value="ueditor.value" :config="ueditor.config" ref="ue"></Ueditor>
    <input type="button" value="显示编辑器内容（从控制台查看）" @click="returnContent">
  </div>

</template>

<script>
  import Ueditor from "@/components/UE/ueditor";
  export default {
    data() {
      return {
        dat: {
          content: "",
        },
        ueditor: {
          value: "编辑默认文字",
          config: {
            initialFrameWidth: 1600,
            initialFrameHeight: 350,
            wordCount: false,
            toolbars: [
              [
                'fullscreen', 'source', '|', 'undo', 'redo', '|',
                'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript',
                'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor',
                'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
                'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
                'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
                'directionalityltr', 'directionalityrtl', 'indent', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase',
                '|',
                'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
                'simpleupload', 'insertimage', 'emotion', 'date', 'time'
              ]
            ]
          }
        }
      };
    },
    methods: {
      returnContent() {
        this.dat.content = this.$refs.ue.getUEContent();
        console.log(this.dat.content);
      },
      showContent() {
        this.show = !this.show;
      }
    },
    components: {
      Ueditor
    }
  };
</script>
